import React, { Component } from 'react'
import A from './components/A'
import B from './components/B'

class index extends Component {
  render() {
    return (
      <div>
        <h1>HOC</h1>
        {/* <A msg={'hello world-------参数'} /> */}
        <B></B>
      </div>
    )
  }
}

export default index

// import React, { Component, useEffect } from 'react'
// import { render } from 'react-dom'
// import withControlledState from '../../utils/withControlledState'

// // function WrapperComponent(props) {
// //   // console.log(props, 'props')
// //   const { controlledProps, getFormData } = props

// //   useEffect(() => {
// //     // console.log('controlledProps:', controlledProps.value)
// //     getFormData && getFormData(controlledProps.value)
// //   }, [controlledProps.value])

// //   return <input name="simple" {...controlledProps} />
// // }

// class WrapperComponent extends Component {
//   componentDidUpdate() {
//     const { controlledProps, getFormData } = this.props
//     // getFormData && getFormData(controlledProps.value)
//     getFormData(controlledProps.value)
//   }

//   render() {
//     const { controlledProps } = this.props
//     return <input name="simple" {...controlledProps} />
//   }

//   // useEffect(() => {
//   //   // console.log('controlledProps:', controlledProps.value)
//   //   getFormData && getFormData(controlledProps.value)
//   // }, [controlledProps.value])
// }

// const Wrapper = withControlledState(WrapperComponent)

// // HOC 高阶组件

// export default class index extends Component {
//   getFormData = (value) => {
//     console.log('value', value)
//   }
//   render() {
//     return (
//       <div>
//         <Wrapper getFormData={this.getFormData}></Wrapper>
//       </div>
//     )
//   }
// }
